<template>
  <a-card :bordered="false">
    <h2>迁移策略执行规则设置</h2>
    <a-form
      :form="form"
      label-align="left"
      :label-col="{ offset: 1, span: 3 }"
      :wrapper-col="{ span: 10 }"
      @submit="handleSubmit"
    >
      <a-form-item label="迁移冷却时间">
        <a-input
          :max-length="2"
          autocomplete="off"
          style="width: 125px"
          addon-after="分钟"
          @keyup="clearNoNum"
          @blur="clearNoNum"
          v-decorator="[
            'cooling',
            {
              rules: [
                { required: true, message: '迁移冷却时间不能为空' },
                { validator: validators.xmax({max:60}), trigger: 'change', },
                { validator: validators.xmin({min:0}), trigger: 'change', },
              ],
            },
          ]"
        />
        <!-- <a-input-number
          :min="0"
          :max="60"
          :parser="value => value ? (isNaN(value) ? 0 : parseInt(value)) : 0"
          v-decorator="[
            'cooling',
            {
              rules: [
                { required: true, message: '迁移冷却时间不能为空' },
                { validator: validators.positiveIntegers() }
              ],
            },
          ]"
        />
        <div
          class="rule-unit"
        >
          分钟
        </div> -->
        <!-- <span style="display: inline-block;padding-left: 10px">分钟</span> -->
      </a-form-item>
      <a-form-item
        :required="true"
        label="迁移时间段"
      >
        <a-time-picker
          v-model="startTime"
          inputReadOnly
          :allowClear="false"
          format="HH:mm"
          :disabledHours="() => disabledStartTime.hour"
          :disabledMinutes="getDisabledStartMinutes"
          @openChange="startTimeChange"
        />
        <span style="padding: 0 15px;">至</span>
        <a-time-picker
          v-model="endTime"
          inputReadOnly
          :allowClear="false"
          format="HH:mm"
          :disabledHours="() => disabledEndTime.hour"
          :disabledMinutes="getDisabledEndMinutes"
          @openChange="endTimeChange"
        />
      </a-form-item>
      <!-- <a-form-item label="并发数">
        <a-input-number
          :min="0"
          :max="100"
          :parser="value => value ? (isNaN(value) ? 0 : parseInt(value)) : 0"
          v-decorator="[
            'concurrent',
            {
              rules: [
                { required: true, message: '并发数不能为空' },
                { validator: validators.positiveIntegers() }  
              ],
            },
          ]"
        />
      </a-form-item> -->
      <a-form-item :wrapper-col="{ span: 12, offset: 3 }">
        <a-button
          type="primary"
          @click="handleSubmit"
        > 提交 </a-button>
      </a-form-item>
    </a-form>
  </a-card>
</template>

<script>
  import moment from "moment";
  import { getAction, gPostAction } from "@/api/manage";
  import { filterNoNum } from "@/utils/util";

  export default {
    name: "F020302",
    data() {
      return {
        form: this.$form.createForm(this),
        startTime: moment('00:00', 'HH-mm'),
        endTime: moment('23:59', 'HH-mm'),
        disabledStartTime: {
          hour: [],
          min: []
        },
        disabledEndTime: {
          hour: [],
          min: []
        },
        colon: false,
      }
    },
    mounted() {
      this.loadData();
    },
    methods: {
      clearNoNum() {
        this.form.setFieldsValue({
          cooling: filterNoNum(this.form.getFieldValue('cooling')),
        });
        this.form.validateFields(['cooling'], (errors, values) => {});
      },
      loadData() {
        getAction("/scheduler/get_scheduler_strategy_rule", {}).then((res) => {
          const data = res.data;
          if (data && data.rule) {
            const info = JSON.parse(data.rule);
            if (info.cooling) {
              this.form.setFieldsValue({
                cooling: info.cooling,
              });
            } else {
              this.form.setFieldsValue({
                cooling: 1,
              });
            }
            // if (info.concurrent) {
            //   this.form.setFieldsValue({
            //     concurrent: info.concurrent,
            //   });
            // } else {
            //   this.form.setFieldsValue({
            //     concurrent: 1,
            //   });
            // }
            if (info.beginTime && info.endTime) {
              if ('Invalid date' === info.beginTime) {
                this.startTime = moment('00:00', 'HH-mm')
              } else {
                this.startTime = moment(info.beginTime, "HH:mm")
              }
              if ('Invalid date' === info.endTime) {
                this.endTime = moment('23:59', 'HH-mm')
              } else {
                this.endTime = moment(info.endTime, "HH:mm")
              }
            }
          }
        });
      },
      handleSubmit(e) {
        e.preventDefault()
        this.form.validateFields((err, values) => {
          if (!err) {
            const postData = {
              cooling: values.cooling,
              beginTime: moment(this.startTime).format('HH:mm'),
              endTime: moment(this.endTime).format('HH:mm'),
              // concurrent: values.concurrent,
            };

            gPostAction("/scheduler/update_scheduler_strategy_rule", {
              rule: JSON.stringify(postData),
            }).then((res) => {
              if (res.success) {
                this.$message.success("操作成功");
              }
            });
          }
        });
      },
      // 禁用时间
      startTimeChange(isOpen) {
        if (!isOpen) {
          this.disabledEndTime = {
            hour: [],
            min: [],
          }
          let h = parseInt(this.startTime.format('HH'))
          let m = parseInt(this.startTime.format('mm')) + 1
          while (h !== 0) {
            h -= 1
            this.disabledEndTime.hour.push(h)
          }
          while (m !== 0) {
            m -= 1
            this.disabledEndTime.min.push(m)
          }
        }
      },
      endTimeChange(isOpen) {
        if (!isOpen) {
          this.disabledStartTime = {
            hour: [],
            min: [],
          }
          let h = parseInt(this.endTime.format('HH'))
          let m = parseInt(this.endTime.format('mm')) - 1
          while (h !== 23) {
            h += 1
            this.disabledStartTime.hour.push(h)
          }
          while (m !== 59) {
            m += 1
            this.disabledStartTime.min.push(m)
          }
        }
      },
      getDisabledStartMinutes(selectedHour) {
        return selectedHour === parseInt(this.endTime.format('HH')) ? this.disabledStartTime.min : []
      },
      getDisabledEndMinutes(selectedHour) {
        return selectedHour === parseInt(this.startTime.format('HH')) ? this.disabledEndTime.min : []
      },
    },
  }
</script>